import { useState, useEffect } from 'react';
import * as signalR from '@microsoft/signalr';
import PubSub from 'pubsub-js';
import { Message } from '@arco-design/web-react';


const baseUrl = process.env.REACT_APP_API_URL_GZ

const url = `${baseUrl}/signalr/enterprise`;


const messages = [
  'TelepathyChangeMessage', // 算力值变动
  'PaySuccessMessage',//支付成功
]

function useSignalR() {
  const [connection, setConnection] = useState(null);

  // 使用effect来管理SignalR连接的启动、消息接收和关闭
  useEffect(() => {
    const startConnection = async () => {
      const token = window.localStorage.getItem("token");
      const conn = new signalR.HubConnectionBuilder()
        .withUrl(url, {
          accessTokenFactory: () => token,
        })
        .configureLogging(signalR.LogLevel.Information)
        .build();

      try {
        await conn.start();
        console.log('SignalR 已连接。');

        // 监听从服务器接收到的消息
        messages.forEach(message => {
          conn.on(message, (data) => {
            console.log('SignalR', message, data);
            PubSub.publish(message, data);
          });
        })

        // 连接关闭时的处理
        conn.onclose((error) => {
          if (error) {
            //Message.error('SignalR 连接错误: ' + error);
            console.error('SignalR 连接错误: ' + error);
          }
          setTimeout(() => startConnection(), 10000); // 10秒后重新连接
        });

        setConnection(conn);
      } catch (err) {
        //Message.error('启动连接时出错: ' + err);
        // 连接启动失败也尝试重连
        setTimeout(() => startConnection(), 10000); // 10秒后重新连接
      }
    };

    startConnection();

    // 组件卸载时停止连接
    return () => {
      if (connection) {
        connection
          .stop()
          .catch((err) => console.error('停止连接时出错: ', err));
      }
    };
  }, []);
}

export default useSignalR;
